<template>
	<div class="message">
		<textarea class="textarea" maxlength="300" :value="value" placeholder="请输入你的文本" @input="send($event)"></textarea>
	</div>
</template>

<script>
export default {
	data() {
		return {
			timer: null
		};
	},
	props: {
		value: {
			type: String,
			default: ''
		}
	},
	methods: {
		send(e) {
			if (this.timer != null) return;
			this.timer = setTimeout(() => {
				this.$emit('input', e.target.value.trim());
				clearTimeout(this.timer);
				this.timer = null;
			}, 500);
		}
	}
};
</script>

<style lang="less" scoped>
.message {
	
	.textarea {
		border: 1rpx solid #d3d3d3;
		width: 560rpx;
	}
}
</style>
